<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <!-- src资源路径:
         1.相对路径:一般访问站内(同项目)资源时使用
            - 图片和页面在同一级目录下 : 直接写图片名
            - 图片在页面的上一级目录中 : ../图片名
            - 图片在页面的下一级目录中 : 文件夹名/图片名
         2.绝对路径:一般访问站外(其他项目)资源,图片盗链:有找不到图片的风险
         alt : 当图片不能正常显示时,显示的文本
         title : 图片标题,在鼠标悬停时显示 -->
    <img src="aa.jpg" alt="这是个美图">
    <img src="../b.jpg" width="500" title="这是一个标题">
    <!-- width/height 两种赋值方式 :
         1.像素,如果只设置宽度时,高度会自动等比例缩放
         2.上级元素的百分比 -->
    <img src="abc/c.jpg" width="350" alt="">
    <img src="abc/c.jpg" width="50%" alt="">
    <img src="https://img13.360buyimg.com/n7/jfs/t1/87366/2/29821/187077/62d22bb6E72b2a709/daba0173937e3ce1.jpg.avif" alt="">
</body>
</html>